<template>
  <uni-nav-bar title="变动明细" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
  <view class="package direction-start">
    <view class="">{{accountAll.title}}</view>
    <view><text>分拨资金</text><text style="margin-left:3rpx;">￥</text><text
        style="font-size: 60rpx;">{{accountAll.money}}</text></view>
  </view>
  <scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box"
    :style="{ height: pageHeight + 'px' }">
    <view class="package" style="padding:0px 20rpx;margin-top:0px" v-if="orderLists.length>0">
      <view class="space-between detailed" v-for="item in orderLists">
        <view class="direction-start">
          <text>{{item.memo}}</text>
          <text style="margin-top:5rpx;">{{item.createtime}}</text>
        </view>
        <view class="">{{item.money}}</view>
      </view>
    </view>
    <view v-if="orderLists.length<1" class="fillings" :style="{ height: pageHeight + 'px' }">
      <image :src="Empty2"></image>
      <text>暂无订单</text>
    </view>
  </scroll-view>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { onLoad } from '@dcloudio/uni-app';
  import { navBack } from '@/utils/navigator';
  import { fenbologlist, teamfenbomoney } from '@/gql/fenbo';
  import { showLoading } from '@/utils/prompt';
  import { toPublish } from '@mqtt';
  import { Empty2 } from '@/utils/Static';
  import { getDriverID } from '@/stores/driverID';
  const driver_id = getDriverID();
  const account_id = ref(0)
  const isLoading = ref(false);
  const lastPage = ref(1);
  const currentPage = ref(1);
  const orderLists = ref([])
  const pageHeight = ref('');
  const accountAll = ref({})
  const teamID = ref(0)
  onLoad((pearm) => {
    uni.getSystemInfo({
      success: function (res) {
        pageHeight.value = (res.windowHeight - 160).toString();
      },
    });
    teamID.value = pearm.teamID
    account_id.value = pearm.id
    init()
    accounts()
  })
  function init() {
    showLoading()
    isLoading.value = true;
    const payload = {
      query: fenbologlist,
      variables: {
        driver_id,
        page: currentPage.value,
        start: '',
        end: '',
        account_id: Number(account_id.value),
        type: ''
      },
    };
    toPublish(
      'ql/driver/getFenboLog',
      payload,
      (obj : any) => {
        uni.hideLoading();
        const { fenbo_log_list } = obj.data;
        isLoading.value = false;
        orderLists.value = [...orderLists.value, ...fenbo_log_list.list];
        lastPage.value = fenbo_log_list.lastpage;
      }
    );
  }
  /**
   * 加载更多
   */
  function loadMore() {
    if (currentPage.value < lastPage.value) {
      currentPage.value++;
      init();
    }
  }
  function accounts() {
    const payload = {
      query: teamfenbomoney,
      variables: {
        driver_id,
        team_id: Number(teamID.value)
      },
    };
    toPublish('ql/driver/getFenboMoney', payload, (obj : any) => {
      const { data } = obj;
      accountAll.value = data.team_fenbo_money;
    });
  }
</script>

<style scoped lang="less">
  .detailed:nth-last-child(1) {
    border-bottom: node;
  }

  .detailed {
    border-bottom: 1px solid #eee;
    padding: 20rpx 0px;
    box-sizing: border-box;
  }

  .fillings {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    image {
      width: 352rpx;
      height: 352rpx;
      margin-top: -140rpx;
    }

    text {
      font-size: 24rpx;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #999999;
      margin-top: 20rpx;
    }
  }
</style>